<template>
	<!-- 同城二手 -->
	<view class="exchange">
		<!-- 头部搜索框 -->
		<view class="search">
		    <view class="search-box">
				<icon class="search-icon" type="search" size="20"></icon>
				<input class="search-input" type="text" placeholder="请输入搜索内容"></input>
			</view>
		</view>
		<!-- 列表 -->
		<goods :goodsList="goodsList"></goods>
		<view class="icon iconfont icon-tianjia" @tap="addGoods">
		</view>
		<!-- tabbar -->
		<tabBar currentPage="exchange"></tabBar>
	</view>
</template>

<script>
	import tabBar from "@/component/commen/tabbar.vue"//引入底部组件
	import ication from "@/component/ication.vue"//引入分类列表
	import goods from "@/component/hot.vue"//引入热门商品组件
	import util from "../../component/commen/api/util";
	export default {
		components:{
			tabBar,ication,goods
		},
		data() {
			return {
				swiperArr:[
					{
						id:0,
						imgUrl:"../../static/images/swiper/swiper01.jpg"
					},
					{
						id:1,
						imgUrl:"../../static/images/swiper/swiper02.jpg"
					}
				],//轮播图
				goodsList:[],//商品列表
			};
		},
		onShow() {
			
		},
		mounted() {
			this.getcateList()
		},
		methods:{
			getcateList(){//获取相关商品信息
				var params = {
					do:"secondgoodslist",
					page:1,
					limit:10,
				}
				util.requestWithSign(params).then(res=>{
					this.goodsList = res.data
					console.log("商品数据：",this.goodsList)
				})
			},
			addGoods(){//点击添加按钮
				uni.navigateTo({
					url:"/otherPages/addGoods/addGoods"
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
.exchange{
	padding-bottom: 150rpx;
	font-size: 29rpx;
	// 头部搜索框
	.search{
		// border:1px solid #f00;
		background: #00b388;
		padding-top: 30rpx;
		height: 100rpx;
		.search-box {
		  display: flex;
		  align-items: center;
		  // padding: 8rpx;
		  width: 95%;
		  padding: 8rpx 20rpx;
		  box-sizing: border-box;
		  // border: 1px solid #ccc;
		  background: #fff;
		  border-radius: 30rpx;
		  margin: 0 auto;
		  .search-icon {
		    margin-right: 10rpx;
		  }
		  .search-input {
		    flex: 1;
		    // height: 30px;
		    // border: none;
		    outline: none;
		  }
		}
	}
	.icon-tianjia{
		position: fixed;
		right: 40rpx;
		bottom: 220rpx;
		font-size: 96rpx;
	}
	// // 分类列表
	// .flList{
	// 	padding: 40rpx 10rpx;
	// 	// border: 1px solid #000;
	// 	background: #fff;
	// }
	// //热门商品
	// .hot{
	// 	padding: 0 20rpx;
	// 	margin-top: 20rpx;
	// 	.hot-title{
	// 		font-size: 32rpx;
	// 		font-weight: bold;
	// 	}
	// }
}
</style>
